import React, { Component } from 'react'
import { connect } from 'react-redux'
import $http from '../http';
export class List extends Component {
  state={
    list:[]
  }

  componentWillMount(){
     $http.get('/api/list').then((res)=>{
        this.setState({
          list:res.data
        })
     })
  }
  render() {
    let {list} =this.state;
    return (
      <ul>
        {list.map((v,i)=>{
          return <li key={i} onClick={()=>{
            this.props.history.push('/detail/'+v.id);
          }}>{v.title} 
             <img src={v.pic} alt="" />
          </li>
        })}
      </ul>
    )
  }
}

const mapStateToProps = (state) => ({
  ...state
})

const mapDispatchToProps = {
  
}

export default connect(mapStateToProps, mapDispatchToProps)(List)
